<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>健康分销</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${contextPath}/staticwx/style/weui.css"/>
    <link rel="stylesheet" href="${contextPath}/staticwx/style/weui2.css"/>
    <link rel="stylesheet" href="${contextPath}/staticwx/style/weui3.css"/>
    <link rel="stylesheet" href="${contextPath}/staticwx/swiper/dist/css/swiper.min.css">
    <link rel="stylesheet" href="${contextPath}/staticwx/city/reset.css">
    <link rel="stylesheet" href="${contextPath}/staticwx/city/shye.css">
    <script src="${contextPath}/staticwx/zepto.min.js"></script>
    <script>
        $(function(){
            $('#tab1').tab({defaultIndex:0,activeClass:"tab-green"});
            $('#tab2').tab({defaultIndex:2,activeClass:"tab-red"});
            $('#tab3').tab({defaultIndex:0,activeClass:"tab-blue"});
            $('#tab4').tab({defaultIndex:0,activeClass:"tab-blue "}); $('#tab5').tab({defaultIndex:1,activeClass:"bg_green"});$('#tab6').tab({defaultIndex:2,activeClass:"bg_red"});
        });

    </script>

    <style>
        body {
            background: #eee;
            font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
            font-size: 14px;
            color:#000;
            margin: 0;
            padding: 0;
        }
        .swiper-container {
            width: 100%;
            height: 450px;
        }
        .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;

            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
        }
    </style>
</head>
<body style="background: #f7f7f7;">
<div class="weui_cells" style="margin-top:0;">
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <img src="${contextPath}/staticwx/images/address-icon.png" style="float: left; line-height: 3.5vw;width: 15px;">
            <p class="dizhiBtn" style="float: left; line-height: 3.5vw;margin-top: 2px; font-weight:bolder;margin-left:4px;"><#if Session.cur_city_name??>${Session.cur_city_name!}</#if></p>
        </div>
        <div class="weui_cell_ft" style="top: 3px;position: fixed;right: 26px;"><a class="icon icon-86 f-black"></a></div>
        <div class="weui_cell_ft" style="top: 21px;position: fixed;right: 17px;font-size: 11px;"><p >扫一扫</p></div>
    </div>
</div>
<!-- Swiper -->
<div class="swiper-container swiper1" style="height: 200px;">
    <div class="swiper-wrapper">
        <div class="swiper-slide" style="background-image:url(http://images.nyjmpt.com/20170916123112145.png);background-size:100% 100%;"></div>
        <div class="swiper-slide" style="background-image:url(http://images.nyjmpt.com/20170916123152745.jpg);background-size:100% 100%;"></div>
        <div class="swiper-slide" style="background-image:url(http://images.nyjmpt.com/20170916123208809.jpg);background-size:100% 100%;"></div>
        <div class="swiper-slide" style="background-image:url(http://images.nyjmpt.com/20170916123225398.jpg);background-size:100% 100%;"></div>
    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination swiper-pagination1"></div>
</div>

<div class="subject-title" style="color: #333;padding-top: 12vw;background: #fff;padding-bottom: 6.666667vw;">
    <div class="am-u-sm-5 clplr am-u-sm-centered subject-title-a" align="center" style="border-bottom: 1px solid #333;font-size: 6.4vw;line-height: 6.4vw;padding-bottom: 2vw;font-weight: bolder;width: 41.66666667%;margin-left: auto;margin-right: auto;float: none;">RECOMMEND</div>
    <div class="am-u-sm-5 clplr am-u-sm-centered subject-title-b am-u-end" align="center" style="font-size: 4vw;line-height: 4vw;padding-top: 2vw;font-weight: bolder;width: 41.66666667%;margin-left: auto;margin-right: auto;float: none;">特别推荐</div>
</div>

<!-- Swiper -->
<div class="swiper-container swiper2">
    <div class="swiper-wrapper">
        <#if recList??>
            <#list recList as pro>
                <div data-id="${pro.id!}" class="swiper-slide buyDiv" style="background-image:url(${pro.coverimg!});background-size:100% 100%;"></div>
            </#list>
        </#if>
    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination swiper-pagination2"></div>
</div>




<div class="searchbar_wrap">
</div>
<div class="weui_cells_title" style="height:45px;">&nbsp;</div>
<div class="weui_tab tab-bottom" style="height: 0;">
    <div class="weui_tabbar ">
        <a href="${contextPath}/wx/index.htm" class="weui_tabbar_item weui_bar_item_on">
            <div class="weui_tabbar_icon">
                <img src="${contextPath}/staticwx/images/icon_nav_button.png" alt="">
            </div>
            <p class="weui_tabbar_label">首页</p>
        </a>
        <a href="javascript: alert('暂未开放');" class="weui_tabbar_item">
            <div class="weui_tabbar_icon">
                <img src="${contextPath}/staticwx/images/icon_nav_msg.png" alt="">
            </div>
            <p class="weui_tabbar_label">购物</p>
        </a>
        <a href="javascript: alert('暂未开放');" class="weui_tabbar_item">
            <div class="weui_tabbar_icon">
                <img src="${contextPath}/staticwx/images/icon_nav_article.png" alt="">
            </div>
            <p class="weui_tabbar_label">合作商</p>
        </a>
        <a href="${contextPath}/wx/member/center.htm" class="weui_tabbar_item">
            <div class="weui_tabbar_icon">
                <img src="${contextPath}/staticwx/images/icon_nav_cell.png" alt="">
            </div>
            <p class="weui_tabbar_label">我的</p>
        </a>
    </div>
</div>

<div class="locationLayer">
    <div class="locationMask"></div>
    <div class="loactionCon">
        <div class="con">
            <div class="tit">选择城市</div>
            <ul class="clearfix cityUl">
                <#list cityList as city>
                    <li <#if city.id?? &&Session.cur_city_id?? &&city.id==(Session.cur_city_id!null)>class="selected"</#if> data-id="${city.id!}">${city.cityname!}</li>
                </#list>
            </ul>
        </div>
    </div>
</div>
<input type="hidden" id="mid" value="${mid!}">
<!-- Swiper JS -->
<script src="${contextPath}/staticwx/swiper/dist/js/swiper.min.js"></script>

<!-- Initialize Swiper -->
<script>

    var swiper1 = new Swiper('.swiper1', {
        pagination: '.swiper-pagination1',
        paginationClickable: true,
        spaceBetween: 30,
    });
    var swiper2 = new Swiper('.swiper2', {
        pagination: '.swiper-pagination2',
        paginationClickable: true,
        spaceBetween: 30,
        loop:true
    });

    $(".dizhiBtn").click(function(){
        $(".locationLayer").fadeIn();
        var top = $(".loactionCon .con").height()
        $(".loactionCon").css("marginTop","-"+top/2+"px")
    });

    $(".locationMask").click(function(){
        //$(".locationLayer").fadeOut();
    });
    $(".loactionCon li").click(function(){
        $(this).addClass("selected").siblings().removeClass("selected")
        var cid=$(this).data("id");
        setCity(cid);
        $(".locationLayer").fadeOut();
    });

    $(".buyDiv").on("click",function () {
        var pid=$(this).data("id");
        setOrderSession(pid);
    })

    var curCity='${Session.cur_city!}';
    if(!curCity){
        $(".dizhiBtn").click();
    }
    function  setCity(cid) {
        $.ajax({
            url : '${contextPath}/wx/setCitySession.htm',
            data : {
                cid:cid
            },
            type : 'post',
            cache : false,
            dataType : 'json',
            success : function(data) {
                var json = $.parseJSON(data);
                if (json.isSuccess == true) {
                    //$(".dizhiBtn").html($(this).text());
                    location.href="${contextPath}/wx/index.htm";
                }else{
                    showMsg(data.msg);
                }
            },
            error : function() {
                //alert("订单提交异常！");
            }
        });
    }

    function setOrderSession(pid){
        var mid=$("#mid").val();
        if(!mid){
            location.href="${contextPath}/wx/loginError.htm";
            return false;
        }
        $.ajax({
            url : '${contextPath}/wx/order/setOrderSession.htm',
            data : {
                pid : pid
            },
            type : 'post',
            cache : false,
            dataType : 'json',
            success : function(data) {
                var json = $.parseJSON(data);
                if (json.isSuccess == true) {
                    location.href="${contextPath}/wx/order/orderEdit.htm?ot=1"
                } else {
                    showMsg(json.errMessage);
                }
            },
            error : function() {
                showMsg("异常");
            }
        });
    }
</script>
</body>
</html>